<script setup lang="ts">
import name from './name.json'
import { ref } from "vue";
  const studentList = name
  // const luckyName = ref('***')
  // function randName(){
  //   studentList.forEach(item => {
  //   });
  // }
  const cardStyle = ref("width: 250px;height: 230px;margin: 20px;")
  function open() {
    cardStyle.value = 'width: 100%;height: 100%;margin: 20px;'
  }
</script>

<template>
  <a-card hoverable :bordered="false" style="width: 320px;height: 260px;">
    <a-flex wrap="wrap" gap="small" style="height: 120px;overflow-x: auto;">
      <a-button v-for="item in studentList"  :key="item.name" type="primary">{{item.name}}</a-button>
    </a-flex>
    <a-button>开动跑起来</a-button>
    <a-card-meta  title="随机点名" description="经典方框版" style="padding-top: 20px;">
      <template #avatar>
        <a-tooltip title="双击变大" color="orange">
          <div @click="open">
        <svg t="1703312892735" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4210" width="64" height="64"><path d="M581.773 464.862l33.707-61.961a12.708 12.708 0 0 0 1.294-3.552c8.164-22.521-1.122-48.236-22.808-60.033-21.685-11.797-48.32-5.623-62.792 13.467a12.716 12.716 0 0 0-2.279 3.016l-31.624 58.132 84.502 50.931z" fill="#F9DFC6" p-id="4211"></path><path d="M565.986 470.328a4.999 4.999 0 0 1-2.581-0.718l-84.502-50.932a4.998 4.998 0 0 1-1.811-6.671l31.625-58.132a17.74 17.74 0 0 1 2.897-3.924c10.193-13.262 26.263-21.169 43.059-21.169 8.994 0 17.949 2.285 25.896 6.608 23.275 12.662 34.083 40.897 25.237 65.802a17.669 17.669 0 0 1-1.721 4.565l-33.706 61.96a4.998 4.998 0 0 1-4.393 2.611z m-77.824-57.745l75.93 45.765 31.209-57.37a7.7 7.7 0 0 0 0.786-2.158c0.049-0.241 0.116-0.478 0.199-0.709 7.387-20.375-1.426-43.562-20.497-53.937-6.484-3.528-13.787-5.393-21.117-5.393-13.802 0-26.999 6.537-35.301 17.487a5.017 5.017 0 0 1-0.487 0.553 7.721 7.721 0 0 0-1.384 1.833l-29.338 53.929z" p-id="4212"></path><path d="M548.097 912.848c71.817 23.245 162.039-23.062 210.609-112.059 53.252-97.576 36.267-209.511-37.928-250.051a12.761 12.761 0 0 0-2.431-1.872l-79.311-47.473c-1.052-1.69-26.009-16.103-27.843-17.181l-232.097-136.39a12.728 12.728 0 0 0-3.507-1.411c-22.239-8.904-48.247-0.473-60.754 20.811s-7.217 48.108 11.384 63.203a12.695 12.695 0 0 0 2.939 2.377l92.378 60.063c1.078 1.055 3.265 1.966 4.453 2.93 0.835 0.912 23.343 16.357 24.465 17.016l106.424 62.09c-1.708 1.23 1.562-1.186-0.125 0.103l-98.408-57.829a12.728 12.728 0 0 0-3.507-1.411c-22.239-8.904-48.247-0.473-60.754 20.811s-7.217 48.108 11.384 63.203a12.695 12.695 0 0 0 2.939 2.377l83.153 48.864a312.12 312.12 0 0 0-0.953 1.707l-81.247-47.744a12.728 12.728 0 0 0-3.507-1.411c-22.239-8.904-48.247-0.473-60.754 20.811s-7.217 48.108 11.384 63.203a12.695 12.695 0 0 0 2.939 2.377l100.509 59.063-0.067 0.688-101.906-59.884a12.728 12.728 0 0 0-3.507-1.411c-22.239-8.904-48.247-0.473-60.754 20.811s-7.217 48.108 11.384 63.203a12.695 12.695 0 0 0 2.939 2.377l118.283 69.508 34.735 20.411" fill="#F9DFC6" p-id="4213"></path><path d="M571.062 916.623c-13.843 0-27.322-2.048-40.107-6.187a5 5 0 0 1 3.08-9.514c33.666 10.897 72.786 6.064 110.152-13.606 38.08-20.046 71.65-54.172 94.527-96.091 51.839-94.986 35.719-204.115-35.937-243.268a5.008 5.008 0 0 1-1.094-0.809 7.63 7.63 0 0 0-1.472-1.14l-79.348-47.495a4.986 4.986 0 0 1-1.165-0.964c-0.88-0.708-5.141-3.684-25.573-15.573l-1.07-0.624L360.96 344.964a7.727 7.727 0 0 0-2.129-0.856 4.962 4.962 0 0 1-0.704-0.223c-20.118-8.055-43.585-0.016-54.585 18.702-10.999 18.718-6.604 43.132 10.224 56.788 0.191 0.155 0.371 0.324 0.538 0.506a7.72 7.72 0 0 0 1.782 1.441c0.065 0.039 0.13 0.079 0.194 0.12l92.378 60.063c0.277 0.18 0.536 0.387 0.772 0.619 0.204 0.176 0.958 0.61 1.456 0.897 0.891 0.513 1.812 1.043 2.65 1.723 0.085 0.069 0.168 0.142 0.25 0.217 2.126 1.709 22.012 15.382 23.65 16.403l5.344 3.118a17.81 17.81 0 0 1 2.493 1.213l56.791 33.374 40.109 23.399c2.039 0.18 3.272 1.707 3.47 1.969 0.122 0.162 2.94 4.011-1.457 7.372-0.248 0.189-0.51 0.353-0.781 0.49-4.022 2.275-6.563-1.101-6.677-1.254l-0.009-0.014-39.79-23.382-58.385-34.063a6.983 6.983 0 0 0-0.466-0.127 4.936 4.936 0 0 1-0.702-0.223c-20.12-8.054-43.586-0.015-54.584 18.703-10.999 18.718-6.604 43.131 10.224 56.787 0.19 0.155 0.37 0.324 0.536 0.505a7.713 7.713 0 0 0 1.785 1.443l83.153 48.864a5 5 0 0 1 1.828 6.757c-0.314 0.561-0.628 1.121-0.94 1.684a4.994 4.994 0 0 1-3.056 2.4 5.008 5.008 0 0 1-3.852-0.513l-81.247-47.744a7.719 7.719 0 0 0-2.127-0.855 4.979 4.979 0 0 1-0.705-0.224c-20.12-8.056-43.586-0.016-54.584 18.702-11 18.719-6.604 43.132 10.224 56.787 0.191 0.155 0.371 0.325 0.537 0.507a7.694 7.694 0 0 0 1.784 1.441l100.51 59.063a4.999 4.999 0 0 1 2.442 4.808l-0.065 0.668a5 5 0 0 1-7.511 3.834l-101.906-59.884a7.724 7.724 0 0 0-2.13-0.857 4.936 4.936 0 0 1-0.702-0.223c-20.119-8.056-43.586-0.015-54.584 18.702-11 18.719-6.604 43.132 10.223 56.787 0.191 0.155 0.371 0.325 0.538 0.507a7.694 7.694 0 0 0 1.784 1.441l153.019 89.92a5 5 0 1 1-5.066 8.621l-153.018-89.919a17.74 17.74 0 0 1-3.827-3.025c-20.41-16.786-25.697-46.555-12.274-69.398 11.119-18.92 32.637-28.935 53.673-26.331-11.744-17.006-13.135-40.028-2.271-58.516 11.075-18.848 32.468-28.865 53.432-26.36-13.712-17.219-15.947-41.874-4.447-61.446 9.394-15.985 26.208-25.617 43.887-26.647-4.725-3.269-9.193-6.418-10.807-7.733l-0.014 0.017c-0.219-0.178-0.867-0.551-1.34-0.823-0.977-0.563-2.067-1.19-3.024-2.016l-91.954-59.787a17.683 17.683 0 0 1-3.723-2.964c-20.41-16.786-25.698-46.555-12.275-69.398 13.424-22.843 42.003-32.708 66.6-23.047a17.733 17.733 0 0 1 4.503 1.869l232.099 136.392 1.032 0.602c19.823 11.534 25.449 15.223 27.384 16.922l78.773 47.151c0.97 0.569 1.923 1.272 2.82 2.083 36.975 20.447 61.376 58.407 68.742 106.966 7.327 48.3-3.108 101.414-29.384 149.56-23.81 43.629-58.843 79.195-98.646 100.149-25.745 13.551-52.373 20.455-77.783 20.455z" p-id="4214"></path><path d="M462.407 865.33l28.747 16.893a118.474 118.474 0 0 0 8.832 5.35c0.835 0.456 1.678 0.888 2.52 1.322" fill="#F9DFC6" p-id="4215"></path><path d="M502.502 893.896a4.985 4.985 0 0 1-2.286-0.556l-0.216-0.112c-0.806-0.414-1.611-0.83-2.411-1.267a124.046 124.046 0 0 1-9.087-5.497l-28.627-16.823a5 5 0 1 1 5.066-8.621l28.747 16.893c0.08 0.047 0.159 0.096 0.236 0.147a113.613 113.613 0 0 0 8.459 5.125c0.728 0.397 1.461 0.774 2.195 1.152l0.219 0.112a5 5 0 0 1 2.155 6.734 5.003 5.003 0 0 1-4.45 2.713z" p-id="4216"></path><path d="M344.1 159.354a2.5 2.5 0 0 1-2.376-3.28 64.392 64.392 0 0 1 5.139-11.632 2.5 2.5 0 1 1 4.349 2.467 59.34 59.34 0 0 0-4.739 10.726 2.499 2.499 0 0 1-2.373 1.719zM352.781 142.375a2.5 2.5 0 0 1-1.931-4.087l0.181-0.221c2.302-2.806 4.826-5.845 6.083-7.106a2.499 2.499 0 1 1 3.542 3.528c-1.256 1.261-4.528 5.249-5.759 6.75l-0.182 0.222a2.498 2.498 0 0 1-1.934 0.914z" fill="#FFFFFF" p-id="4217"></path><path d="M558.555 127.172c-12.067-11.858-28.404-20.659-46.422-21.194-22.224 1.043-42.076 6.253-54.008 23.027-0.891-1.209-1.164 5.203-2.132 4.055a70.532 70.532 0 0 0-2.734 3.583c-8.655-11.746-21.056-20.69-35.433-25.344a70.9 70.9 0 0 0-18.478-3.021c-17.305 0.825-33.985 7.943-46.264 20.437-18.2 18.268-23.504 44.47-17.002 69.06 6.509 25.344 24.573 49.079 45.115 68.518 19.27 17.939 40.52 32.09 56.94 40.246M438.137 306.539c8.09 4.06 14.807 6.434 19.597 7.131 14.097-2.399 47.422-20.945 75.619-48.454 19.949-19.54 37.596-43.586 43.66-69.293 5.82-24.698 0.059-50.804-18.457-68.75" fill="#F44444" p-id="4218"></path><path d="M558.548 126.388c-12.067-11.858-28.404-20.659-46.422-21.194-1.708 0.08-3.399 0.188-5.077 0.321 16.499 1.567 31.39 9.939 42.596 20.951 18.516 17.946 24.277 44.053 18.457 68.75-6.063 25.706-23.71 49.753-43.66 69.293-25.589 24.964-55.399 42.546-71.232 47.378 1.649 0.465 3.162 0.801 4.515 0.998 14.097-2.399 47.422-20.945 75.619-48.454 19.949-19.54 37.596-43.586 43.66-69.293 5.822-24.697 0.06-50.804-18.456-68.75" fill="#9B2F2F" p-id="4219"></path><path d="M454.921 314.9c-5.413 0-13.514-2.63-23.445-7.614a2.5 2.5 0 0 1 2.242-4.468c9.048 4.541 16.781 7.135 21.304 7.083 11.257-0.098 46.682-18.849 76.571-48.009 15.965-15.637 36.384-40.146 42.973-68.078 5.906-25.061-0.734-49.876-17.764-66.38a2.5 2.5 0 0 1 3.48-3.591c18.305 17.742 25.464 44.328 19.15 71.119-6.865 29.099-27.903 54.402-44.345 70.506-31.23 30.469-67.655 49.326-80.022 49.434-0.047-0.002-0.096-0.002-0.144-0.002z" p-id="4220"></path><path d="M432.596 307.551c-0.374 0-0.753-0.084-1.11-0.261-18.883-9.379-39.853-24.198-57.532-40.655-16.837-15.933-38.442-40.95-45.833-69.726-7.028-26.581-0.431-53.296 17.652-71.447 18.472-18.794 47.041-25.901 72.765-18.091 13.642 4.416 25.822 12.734 34.669 23.606 13.552-17.347 33.813-27.336 56.098-27.53 11.999-0.102 23.861 2.74 34.293 8.227a2.5 2.5 0 1 1-2.326 4.425c-9.706-5.104-20.777-7.753-31.923-7.652-21.788 0.19-41.494 10.436-54.067 28.109a2.501 2.501 0 0 1-2.016 1.051h-0.021a2.5 2.5 0 0 1-2.013-1.017c-8.35-11.332-20.492-20.014-34.19-24.448-23.923-7.261-50.52-0.658-67.715 16.838-16.827 16.89-22.941 41.808-16.368 66.668 7.098 27.638 28.071 51.874 44.416 67.341 17.071 15.892 38.136 30.784 56.334 39.822a2.502 2.502 0 0 1-1.113 4.74z" p-id="4221"></path><path d="M349.036 148.175a2.5 2.5 0 0 1-2.172-3.734 63.442 63.442 0 0 1 6.126-8.923 2.5 2.5 0 0 1 3.865 3.173 58.366 58.366 0 0 0-5.641 8.217 2.502 2.502 0 0 1-2.178 1.267zM371.87 125.146a2.502 2.502 0 0 1-1.262-4.661 66.108 66.108 0 0 1 5.955-3.074 2.5 2.5 0 1 1 2.067 4.553 61.176 61.176 0 0 0-5.503 2.842c-0.397 0.23-0.83 0.34-1.257 0.34zM384.168 119.632a2.501 2.501 0 0 1-0.776-4.877 67.69 67.69 0 0 1 17.8-3.268 2.5 2.5 0 0 1 0.238 4.994 62.647 62.647 0 0 0-16.484 3.026 2.49 2.49 0 0 1-0.778 0.125z" fill="#FFFFFF" p-id="4222"></path><path d="M612.11 290.85c4.581 7.738 10.177 14.426 14.769 18.684 2.75 2.571 5.075 4.127 6.645 4.575 3.965 1.131 17.628-1.671 30.356-8.402 8.423-4.476 16.526-10.65 20.995-18.487 4.292-7.53 4.925-16.639 0.591-24.307-2.952-5.309-7.945-9.412-14.223-11.203-7.683-2.191-15.434-0.383-21.19 4.139-1.701-4.684-4.901-8.812-9.162-11.725-7.447-4.893-17.064-5.314-24.708-1.063-7.727 4.228-11.995 12.3-12.239 20.985-0.314 8.931 3.312 18.452 8.166 26.804z" fill="#F4DD50" p-id="4223"></path><path d="M635.806 315.853c-1.086 0-1.991-0.102-2.692-0.302-2.372-0.676-5.256-3.049-7.259-4.921-5.321-4.935-10.803-11.867-15.035-19.016-4.023-6.923-8.736-17.324-8.374-27.621 0.27-9.614 5.136-17.935 13.018-22.248 3.648-2.029 7.837-3.104 12.104-3.104 5.044 0 9.937 1.462 14.147 4.229 3.931 2.687 7.069 6.416 9.003 10.647 6.079-4.048 13.819-5.278 20.937-3.25 6.512 1.858 11.883 6.09 15.122 11.917 4.393 7.771 4.171 17.412-0.599 25.779-5.134 9.004-14.576 15.339-21.594 19.069-10.951 5.791-22.767 8.821-28.778 8.821z m-8.239-74.212c-3.758 0-7.442 0.944-10.656 2.731-6.944 3.8-11.229 11.169-11.468 19.716-0.337 9.593 4.145 19.438 7.964 26.008 4.024 6.798 9.444 13.658 14.491 18.338 3.488 3.261 5.384 4.045 6.037 4.232 0.299 0.085 0.865 0.187 1.87 0.187 5.504 0 16.968-2.969 27.373-8.472 6.664-3.542 15.615-9.524 20.394-17.904 4.24-7.44 4.461-15.974 0.588-22.826-2.855-5.136-7.588-8.861-13.328-10.499-6.845-1.951-14.316-0.473-19.853 3.876a1.498 1.498 0 0 1-2.337-0.667c-1.595-4.393-4.649-8.299-8.599-10.999a22.675 22.675 0 0 0-12.476-3.721z" p-id="4224"></path><path d="M308.799 311.84c4.196 1.622 8.465 2.518 11.588 2.769 1.877 0.159 3.272 0.05 4.027-0.26 1.908-0.783 6.409-6.114 9.327-12.7 1.924-4.366 3.196-9.301 2.526-13.764-0.645-4.287-3.217-8.063-7.293-9.734-2.804-1.172-6.036-1.239-9.057 0.001a11.82 11.82 0 0 0-7.045 8.187c-2.119-1.314-4.654-1.945-7.23-1.771-4.441 0.383-8.35 3.195-10.038 7.232-1.727 4.053-0.905 8.547 1.688 12.035 2.642 3.607 7.015 6.225 11.507 8.005z" fill="#F44444" p-id="4225"></path><path d="M321.983 316.182c-0.532 0-1.112-0.026-1.723-0.078-3.682-0.296-8.059-1.34-12.002-2.865-3.822-1.514-9.026-4.217-12.176-8.518-3.028-4.073-3.725-9.127-1.858-13.509 1.886-4.511 6.319-7.709 11.289-8.139a13.711 13.711 0 0 1 6.471 1.109c1.326-3.36 3.934-6.011 7.363-7.418 3.296-1.353 6.972-1.349 10.205 0.003 4.373 1.792 7.441 5.867 8.198 10.895 0.796 5.308-0.994 10.865-2.637 14.592-2.976 6.717-7.727 12.496-10.13 13.483-0.718 0.295-1.728 0.445-3 0.445z m-15.502-30.142c-0.245 0-0.492 0.008-0.738 0.025-3.843 0.332-7.291 2.811-8.755 6.314-1.449 3.4-0.883 7.345 1.508 10.562 2.166 2.956 5.917 5.548 10.856 7.505 3.619 1.399 7.794 2.398 11.156 2.668 0.534 0.045 1.028 0.068 1.476 0.068 1.229 0 1.735-0.168 1.861-0.22 1.186-0.487 5.517-5.129 8.525-11.92 1.481-3.362 3.104-8.337 2.414-12.934-0.598-3.973-2.982-7.176-6.378-8.569-2.521-1.052-5.354-1.05-7.919 0.001-3.122 1.281-5.366 3.888-6.156 7.152a1.5 1.5 0 0 1-2.248 0.922 10.616 10.616 0 0 0-5.602-1.574z" p-id="4226"></path></svg>
          </div>
        </a-tooltip>
      </template>
    </a-card-meta>
  </a-card>
</template>

<style scoped>
</style>
